<template>
  <div clsaa="body-bgs">
    <div class="my-ob">
      <span class="myobj">我的项目</span>
      <div class="memory">
          <el-button @click="drawer = true" style="" type="primary">+创建项目</el-button>
      </div>
      <!-- <div class="memory">
        <el-progress :percentage="percentage"></el-progress>
      </div> -->
    </div>
    <div class="search-conditions" style="">
      <el-form ref="form" :inline="true" :model="formInline" class="demo-form-inline">
        <el-form-item label="项目名称">
          <el-input v-model="formInline.user" clearable placeholder="输入项目名称"></el-input>
        </el-form-item>
        <el-form-item label="创建时间">
          <el-date-picker
            v-model="times"
            type="daterange"
            align="right"
            unlink-panels
            range-separator="至"
            start-placeholder="开始日期"
            end-placeholder="结束日期"
            value-format="yyyy-MM-dd"
            :picker-options="pickerOptions"
            
          ></el-date-picker>
        </el-form-item>
        <el-form-item label="编制阶段">
          <el-select v-model="formInline.objClass" @change="getId" clearable placeholder="请选择">
            <el-option
              v-for="item in condition.stage"
              :key="item.id"
              :label="item.name"
              :value="item.id"
            ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="项目分类">
          <el-select
            @change="calssifyChange"
            v-model="formInline.Prepare"
            clearable
            placeholder="请选择"
          >
            <el-option
              v-for="(item,key) in condition.calssify"
              :key="key"
              :label="key"
              :value="key"
            ></el-option>
          </el-select>
          <el-select v-model="formInline.Prepare1" @change="getKey" clearable placeholder="请选择">
            <el-option v-for="(item,key) in subList" :key="key" :label="subList[key]" :value="key"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="search">查询</el-button>
        </el-form-item>
      </el-form>
    </div>
    <div class="create-obj">
      <!-- <el-button @click="drawer = true" type="primary">+创建项目</el-button> -->

      <!-- 这个是右边的抽屉 -->
        <el-drawer :visible.sync="drawer" size="80%">
          <!-- 面包屑 -->
          <el-breadcrumb class="breadcrumb">
            <el-breadcrumb-item :to="{ path: '/' }">我的项目</el-breadcrumb-item>
            <el-breadcrumb-item>创建项目</el-breadcrumb-item>
            <el-breadcrumb-item>基本信息</el-breadcrumb-item>
          </el-breadcrumb>
          <el-steps :active="1" simple class="step">
            <el-step title="步骤 1" icon="el-icon-edit"></el-step>
            <el-step title="步骤 2" icon="el-icon-upload"></el-step>
          </el-steps>
          <div class="tit">基本信息</div>
          <div class="form-sub">
            <el-form
              :model="formInline"
              :rules="rules"
              ref="ruleForm"
              label-width="100px"
              class="demo-ruleForm"
            >
              <el-form-item label="项目名称" prop="objName">
                <el-input  v-model="formInline.objName" clearable placeholder="请填写项目名称"></el-input>
              </el-form-item>
              <el-form-item label="编制阶段" prop="objClasss">
                <el-select
                  v-model="formInline.objClasss"
                  clearable
                  placeholder="请选择"
                >
                  <el-option
                    v-for="(item,id) in condition.stage"
                    :key="id"
                    :label="item.name"
                    :value="item.id"
                  ></el-option>
                </el-select>
              </el-form-item>

              <el-form-item label="项目分类" prop="Prepares">
                <el-col :span="11">
                  <el-form-item prop="Prepares">
                    <el-select
                      @change="calssifyChange"
                      v-model="formInline.Prepares"
                      placeholder="请选择"
                    >
                      <el-option
                        v-for="(item,key) in condition.calssify"
                        :key="key"
                        :label="key"
                        :value="key"
                      ></el-option>
                    </el-select>
                  </el-form-item>
                </el-col>
                <el-col class="line" :span="2" style="padding-left:1rem">-</el-col>
                <el-col :span="11">
                  <el-form-item prop="Prepares">
                    <el-select v-model="formInline.Prepare1s" placeholder="请选择">
                      <el-option
                        v-for="(item,key) in subList"
                        :key="key"
                        :label="subList[key]"
                        :value="key"
                      ></el-option>
                    </el-select>
                  </el-form-item>
                </el-col>
              </el-form-item>
              <div>
                <el-form-item label="项目地点" prop="selectedOptions">
                  <el-cascader
                    size="large"
                    id="selectedOptions"
                    :options="options"
                    v-model="formInline.selectedOptions"
                    @change="handleChange"
                  ></el-cascader>
                </el-form-item>
              </div>
              <el-form-item>
                <el-button type="primary" @click="send('ruleForm')">下一步</el-button>
                <el-button @click="resetForm('ruleForm')">重置</el-button>
              </el-form-item>
            </el-form>
          </div>
          </el-drawer>
          <!-- <el-button @click="innerDrawer = true">打开里面的!</el-button> -->
          <div>

          <el-drawer
            :append-to-body="true"
            :before-close="handleClose"
            :visible.sync="innerDrawer"
            size="60%"
          >
            <el-breadcrumb class="breadcrumb">
              <el-breadcrumb-item :to="{ path: '/' }">我的项目</el-breadcrumb-item>
              <el-breadcrumb-item>创建项目</el-breadcrumb-item>
              <el-breadcrumb-item>上传文件</el-breadcrumb-item>
            </el-breadcrumb>
            <el-steps :active="2" simple class="step-two">
              <el-step title="步骤 1" icon="el-icon-edit"></el-step>
              <el-step title="步骤 2" icon="el-icon-upload"></el-step>
            </el-steps>

            <div class="tit">上传文件</div>
            <!-- <div class="selectType">
              <el-radio v-model="radios" label="1" @change="getValue()">上传GBQ文件</el-radio>
              <el-radio v-model="radios" label="2" @change="getValue()">上传XML文件</el-radio>
            </div> -->
            <div class="upload-file">
              <!-- <form enctype="multipart/form-data"> -->
              <!-- html5支持选择文件夹上传 -->
              <!-- <input type="file" name="folder" multiple webkitdirectory> -->
              <!-- <button type="submit" @click="uploads()">上传</button> -->
              <!-- </form> -->
              <el-upload
                class="upload-demo"
                :action="uploadUrl()"
                :before-upload="beforeAvatarUpload"
                drag
                ref="upload"
                :file-list="fileList"
                :on-success="handle_success"
                :on-remove="handleRemove"
                :data="myData"
                :limit="limit"
                :name="fil"
                :auto-upload="false"
                :on-exceed="handleExceed"
                :on-change="handleChanges"
                :on-progress="progress"
                multiple
              >
                <i class="el-icon-upload"></i>
                <div class="el-upload__text">
                  将文件拖到此处，或
                  <em>点击上传</em>
                </div>
                <div class="el-upload__tip" slot="tip">{{uploadContent}}</div>
                <div class="el-upload__tip" slot="tip" style="color:red;">{{tipContent}}</div>
              </el-upload>
                  <el-button v-if="this.shows == 0" type="primary" style="margin-top:2rem;" @click.native="sends()">立即上传</el-button>
                  <el-button v-else-if="this.shows == 2" style="margin-top:2rem;" disabled>文件正在上传中</el-button>
                  <el-button v-else type="primary"  style="margin-top:2rem;" @click="clo()">关闭</el-button>
            </div>
          </el-drawer>
        </div>
      
      <span class="refresh">
        <span>总共1个项目</span>
        <span class="ref" @click="refre()"><i class="el-icon-refresh"></i>点击刷新项目状态</span>
      </span>
    </div>
    <div class="card" v-for="(con,index) in list" :key="index" :prop="list">
      <el-card class="box-card">
          <div class="obj-name">
             <el-tooltip class="item" effect="dark" v-if="con.projName.length>100"  :content="con.projName" placement="top">
               <div class="objn">项目名称：{{con.projName}}</div>
            </el-tooltip>
            <template v-else>
               <div class="objn">项目名称：{{con.projName}}</div>
            </template>
           
            <div class="obj-message">
              <span>项目分类：{{con.subCategory}}</span>
              <span>创建时间：{{con.createTime}}</span>
              <span>编制阶段：{{con.stageName}}</span>
              <span>项目地点：{{con.address}}</span>
            </div>
          </div>
          <div class="tGroup">
            <div class="tag-group">
              <el-tag
                v-if="con.fileState == '0'"
                :key="items[0].label"
                :type="items[0].type"
                effect="dark"
              >{{ items[0].label }}</el-tag>
              <el-tag
                v-else-if="con.fileState == '1'"
                :key="items[1].label"
                :type="items[1].type"
                effect="dark"
              >{{ items[1].label }}</el-tag>
              <el-tag
                v-else-if="con.fileState == '2'"
                :key="items[2].label"
                :type="items[2].type"
                effect="dark"
              >{{ items[2].label }}</el-tag>
              <el-tag
                v-else
                :key="items[3].label"
                :type="items[3].type"
                effect="dark"
              >{{ items[3].label }}</el-tag>
            </div>
            <div class="operation-btn">
              <!-- <el-button plain :disabled="con.fileState!=='1'" icon="el-icon-pie-chart">清单待自检</el-button> -->
              <el-button
                plain
                :disabled="con.fileState!=='1'"
                @click="analyze(con.id)"
                icon="el-icon-pie-chart"
              >指标分析</el-button>
              <el-button
                plain
                :disabled="con.fileState!=='1'"
                @click="contrast(con.id)"
                icon="el-icon-pie-chart"
              >单项对比</el-button>
            </div>

            
            <div v-if="con.fileState == '0'">
              <el-dropdown class="three-point">
                <span class="el-dropdown-link point">...</span>
                <el-dropdown-menu slot="dropdown">
                  <el-dropdown-item @click.native="drawer = false;innerDrawer = true;updateFile(con.id)">
                    <i class="el-icon-document-add">新增文件</i>
                  </el-dropdown-item>
                  <el-dropdown-item @click.native="open(con.id)">
                    <i class="el-icon-delete">删除</i>
                  </el-dropdown-item>
                  <el-dropdown-item @click.native="drawerUpdate=true;update(con.id)">
                    <i class="el-icon-edit">编辑信息</i>
                  </el-dropdown-item>
                </el-dropdown-menu>
              </el-dropdown>
            </div>
            <div v-else-if="con.fileState == '3'">
              <!-- <el-dropdown class="three-point"> -->
                <!-- <span class="el-dropdown-link point">...</span> -->
            </div>
            <div v-else>
              <el-dropdown class="three-point">
                <span class="el-dropdown-link point">...</span>
                <el-dropdown-menu slot="dropdown">
                  <el-dropdown-item @click.native="drawer = false,innerDrawer = true;updateFile(con.id)">
                    <i class="el-icon-document-add">编辑文件</i>
                  </el-dropdown-item>
                  <el-dropdown-item @click.native="open(con.id)">
                    <i class="el-icon-delete">删除</i>
                  </el-dropdown-item>
                  <el-dropdown-item @click.native="drawerUpdate = true;update(con.id)">
                    <i class="el-icon-edit">编辑信息</i>
                  </el-dropdown-item>
                </el-dropdown-menu>
              </el-dropdown>
            </div>
          </div>
      </el-card>
    </div>
    <!-- 这是修改的抽屉 -->
    <el-drawer :visible.sync="drawerUpdate" size="80%">
      <div>
        <div class="titup">基本信息</div>
        <div class="form-subup">
          <el-form
            :model="updateMess"
            :rules="rules"
            ref="ruleForm"
            label-width="100px"
            class="demo-ruleForm"
          >
            <el-form-item label="项目名称">
              <el-input v-model="updateMess.projName"></el-input>
            </el-form-item>
            <el-form-item label="编制阶段">
              <el-select v-model="updateMess.stageName" :disabled="true"></el-select>
            </el-form-item>

            <el-form-item label="项目分类">
                <el-col :span="11">
                    <el-select @change="calssifyChange" v-model="updateMess.category" :disabled="true">
                      <el-option
                        v-for="(item,key) in condition.calssify"
                        :key="key"
                        :label="key"
                        :value="key"
                      ></el-option>
                    </el-select>
                </el-col>
                <el-col class="line" :span="2" style="padding-left:1rem">-</el-col>
                <el-col :span="11">
                    <el-select v-model="updateMess.subCategory" :disabled="true">
                      <el-option
                        v-for="(item,key) in subList"
                        :key="key"
                        :label="subList[key]"
                        :value="key"
                      ></el-option>
                    </el-select>
                </el-col>
              </el-form-item>

           
            <!-- 三级城市级联 -->
            <div>
              <el-form-item label="项目地点">
                <el-cascader size="large" v-model="updateMess.address"  :disabled="true"></el-cascader>
              </el-form-item>
            </div>

            <el-form-item>
              <!-- <el-button type="primary" @click="submitForm('ruleForm')">确认</el-button> -->
              <el-button type="primary" @click="sureupdate(updateMess.id)">确认修改</el-button>
            </el-form-item>
          </el-form>
        </div>
      </div>
    </el-drawer>
  </div>
</template>
<script>
import {
  provinceAndCityData,
  regionData,
  provinceAndCityDataPlus,
  regionDataPlus,
  CodeToText,
  TextToCode,
} from "element-china-area-data";
import $ from "jquery";
import {Loading} from 'element-ui'
export default {
  inject: ["reload"],
  name: "ChinaArea",
  provide(){
    return {
      reload:this.reload
    }
  },
  data() {
    return {
      options: regionData,
      selectedOptions: [],
      percentage: 60,
      input: "",
      loading:true,
      pickerOptions: {
        shortcuts: [
          {
            text: "最近一周",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
              picker.$emit("pick", [start, end]);
            },
          },
          {
            text: "最近一个月",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
              picker.$emit("pick", [start, end]);
            },
          },
          {
            text: "最近三个月",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
              picker.$emit("pick", [start, end]);
            },
          },
        ],
      },
      times: "",
      condition: [],
      value: "",
      radios: "1",
      limit: "",
      fil:"",
      upload_url: "", //上传URL
      percentage: 0,
      formInline: {
        user: "",
        region: "",
      },
      projName: [
        { required: true, message: "请输入项目名称", trigger: "blur" },
      ],
      items: [
        { type: "warning", label: "文件待上传" },
        { type: "success", label: "解读数据成功" },
        { type: "info", label: "解读文件失败" },
        { type: "loads", label: "文件正在解析中" },
      ],
      drawer: false,
      innerDrawer: false,
      drawerUpdate: false,
      ruleForm: {
        region: "",
        resource: "",
      },
      rules: {
        objName: [
          { required: true, message: "请填写项目名称", trigger: "change" },
        ],

        objClasss: [
          { required: true, message: "请选择编制阶段", trigger: "change" },
        ],

        Prepares: [
          { required: true, message: "请选择项目分类", trigger: "change" },
        ],
        selectedOptions: [
          { required: true, message: "请选择项目地点", trigger: "change" },
        ],
      },
      radio: "",
      list: [],
      updateMess: [],
      subList: {},
      bzId: "",
      xmKey: "",
      projnames: "",
      classifys: "",
      stages: "",
      addres: "",
      uploadContent: "",
      tipContent:"",
      upId: "",
      addId: "",
      fileList: [],
      fiNam:'',
      filStat:'',
      upStat:'',
      shows:'',
     //listcopy: {}, //储蓄数据
    };
  },
   startLoading: function() {
      loading = Loading.service({
          lock: true,
          text: '加载中……',
          background: 'rgba(1, 1, 1, 0.7)'
      })
    },
  endLoading: function() {
      loading.close();      
  },
  mounted() {
    this.limit = 1;
    this.fil = 'file'
    this.uploadContent = "只允许上传GBQ类型的文件(最多上传一个)";

    this.$http.post("/GetProjectList", {}).then((result) => {
      this.data = result.data;
      if (this.data.status == "200") {
        this.list = this.data.data;
      }
    }),
      this.$http.post("/GetSearchParms", {}).then((result) => {
        this.data = result.data;
        if (this.data.status == "200") {
          this.condition = this.data.data;
        }
      });
      
  },
  computed: {
    myData(fileList) {
      let filed = fileList;
      let idts = "";
      if (this.upId) {
        idts = this.upId;
      } else {
        idts = this.addId;
      }
      return {
        projId: idts,
        file: filed,
      };
    },
  },
  methods: {
    calssifyChange(data) {
      // console.log(999999,data);
      this.subList = this.condition.calssify[data] || {};
    },
    submitUpload() {
      // console.log(121212121);
      this.$refs.upload.submit();
    },
    handleRemove(file, fileList) {
      this.fileList = fileList;
    },
    handlePreview(file) {
      // console.log(400000,file);
    },
    getId(id) {
      this.bzId = id;
    },
    getKey(id) {
      this.xmKey = id;
    },
    refresh: function () {
      this.$router.go(0);
    },
    refre(){
       this.$http.post("/GetProjectList", {}).then((result) => {
        this.data = result.data;
        this.loading=true;
        if (this.data.status == "200") {
          this.list = this.data.data;
          console.log(this.list);
          this.loading=false;
        }
        })
    },
    analyze(id) {
      localStorage.setItem('pId', id);
      this.$router.push({ name: "indicators", params: { id: id } });
    },
    contrast(id) {
      localStorage.setItem('pId', id);
      this.$router.push({ name: "Tree", params: { id: id } });
    },
    progress(event, file, fileList){
      
      // console.log("zheshi sha a ")
      // console.log(event);
      // console.log(file);
      // console.log(fileList);
    },
    // 下一步
    send(formName) {
      
      this.$refs[formName].validate((valid) => {
   
        if (valid) {
          let province = CodeToText[this.formInline.selectedOptions[0]];
          let city = CodeToText[this.formInline.selectedOptions[1]];
          let region = CodeToText[this.formInline.selectedOptions[2]];
          let arr = new Array();
          arr.push(province);
          arr.push(city);
          arr.push(region);
          let str = arr.join("/");
          // if(province && city && region && str){

          // }else{}
          this.$http.post("/CreateProject", {
              projname: this.formInline.objName,
              classify: this.formInline.Prepare1s,
              stage: this.formInline.objClasss,
              address: str,
            }).then((result) => {
              this.data = result.data;
              //  这个方法返回的就是新增的项目id,然后上传文件的时候用这个id来确认是哪个项目
              if (this.data.status == "200") {
                this.addId = this.data.data;
                if(this.addId){
                  this.drawer = false;
                  this.innerDrawer = true;
                }
                // this.reload();
                this.isRouterAlive = true;
                // this.listcopy = {
                //   ...{
                //     projname: this.formInline.objName,
                //     classify: this.formInline.Prepare1s,
                //     stage: this.formInline.objClasss,
                //   },
                //   ...{ addId: this.addId, address: str },
                // };
              }else if(this.data.status == "500"){
                 this.$message.error(this.data.msg);
              }
            });
          // 这个就是新增
          // this.innerDrawer = true;
        } else {
          this.innerDrawer = false;
          // this.$message.error("'*'标记的都为必填项，请核查后，再次进行提交");
          return false;
        }
      });
    },
    sends(){
      // let userNmae = localStorage.getItem("userMess");
      // console.log(userNmae);
      this.shows = 0;
      if(this.filStat == 'ready'){
        if(this.upStat != '200'){
          // 正在上传
          this.shows = 2;
        }
          this.$refs.upload.submit();
        

      }else{
         this.$alert("您还未上传文件，确认后，您可以对项目进行修改来完成项目文件的补充", "确认完成么？", {
          showCancelButton: true,
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          beforeClose: (action, instance, done) => {
            // console.log(action)
            if (action === 'confirm') {
              location.reload();
            } else {
              done();
            }
          }
        });
        // location.reload();
      }
    },
    clo(){
      location.reload();
    },
    update(id) {
      this.$http
        .post("/ProjectInfo", {
          projId: id,
          projName: this.formInline.objName,
        })
        .then((result) => {
          this.data = result.data;
          if (this.data.status == "200") {
            this.updateMess = this.data.data;
          }
        });
        // location.reload();
    },

    uploadUrl: function () {
      if (this.radios == "1") {
        this.limit = 1;
        this.fil = 'file';
        let userNmae = JSON.parse(localStorage.getItem("userMess"));
        let userid = userNmae.id;
        return "http://121.89.203.242:8080/UploadSingleGBQ?userId="+userid;
      } else {
        console.log(this.radios);
        this.limit = 100;
        this.fil = 'files';
        return "http://121.89.203.242:8080/UploadMultiXml";
      }
    },
    handle_success(response, file, fileList) {
      // console.log(response)
      this.upStat = response.status;
      this.tipContent = response.data;
       if(this.upStat == '200'){
          // 成功
            this.shows = 1;
          }
      this.fileList.push({
        name: file.name,
        url: file.response,
      });

      // this.list.unshift(this.listcopy);
    },
    updateFile(id) {
      this.upId = id;
    },
    getValue() {
      if (this.radios == "1") {
        this.uploadContent = "只允许上传GBQ类型的文件(最多上传一个)";
          this.$refs['upload'].clearFiles();
      } else {
        this.uploadContent = "只允许上传XML类型的文件(可上传多个)";
        
            this.$refs['upload'].clearFiles();
        
      }
    },
    handleExceed(files, fileList) {
      console.log(575676,files);
      console.log(978987,fileList);
      if (this.radios == "1") {
        this.$alert("GBQ类型的文件只允许上传一个!!!", "提示", {
          confirmButtonText: "确定",
        });
        return false;
      }
    },
    handleChanges(file, fileList){
      // console.log("这个是change把")
      this.filStat = file.status
    },
    beforeAvatarUpload(file) {
      console.log(6666,file.name)
      this.fiNam = file.name;
      //获取文件名
      let files = file.name;
      //获取文件的后缀名，并转换为小写
      const filesd = files.substring(files.indexOf(".") + 1).toLowerCase();
      console.log(filesd.indexOf("gbq"));
      // return false;
      //判断文件后缀名是否包含gbq字样
      if(filesd.indexOf("gbq") < 0){
        this.$alert(
          "您目前只能上传GBQ类型的文件",
          "提示",
          {
            confirmButtonText: "确定",
          }
        );
        return false;
      }

      // if (filesd.indexOf("gbq") >= 0 && this.radios != "1") {
      //   this.$alert(
      //     "您上传的文件与您所选的类型不一致，请确认后重新上传",
      //     "提示",
      //     {
      //       confirmButtonText: "确定",
      //     }
      //   );
      //   return false;
      // } else if (filesd.indexOf("xml") >= 0 && this.radios != "2") {
      //   this.$alert(
      //     "您上传的文件与您所选的类型不一致，请确认后重新上传",
      //     "提示",
      //     {
      //       confirmButtonText: "确定",
      //     }
      //   );
      //   return false;
      // }
    },
    sureupdate(id) {
      this.$http
        .post("/UpdateProject", {
          projId: id,
          projName: this.updateMess.projName,
        })
        .then((result) => {
          this.data = result.data;
          if ((this.data.status == "200")) {
            location.reload();
            next();
          }
        });
    },

    search() {
      var time1='';
      var time2='';
      if(this.times){
         time1 = this.times[0]
         time2 = this.times[1]
      }else{
         time1 = '';
         time2 = '';
      }
      this.$http
        .post("/GetProjectList", {
          projName: this.formInline.user,
          createTimeSrc: time1,
          createTimeDst: time2,
          classify: this.xmKey,
          stage: this.bzId,
        })
        .then((result) => {
          this.data = result.data;
          if (this.data.status == "200") {
            this.list = this.data.data;
          }
        });
    },
    customColorMethod(percentage) {
      if (percentage <= 60) {
        return "#67C23A";
      } else if (percentage <= 70) {
        return "#E6A23C";
      } else {
        return "#F56C6C";
      }
    },
    onSubmit() {},
    handleClose(done) {
      this.$confirm("还有未保存的工作哦确定关闭吗？")
        .then((_) => {
          location.reload();
          done();
        })
        .catch((_) => {});
    },

    // 最终提交按钮获取控件的值
    submitForm(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          alert("submit!");
        } else {
          return false;
        }
      });
    },
    resetForm(formName) {
      this.$refs[formName].resetFields();
      this.formInline.Prepare1s = "";
      this.formInline.Prepares = "";
    },

    handleChange(val) {},
    open(id) {
      this.$confirm("此操作将永久删除该文件, 是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          this.$http
            .post("/DeleteProject", {
              projId: id,
              headers: { "Content-Type": "application/json" },
            })
            .then((result) => {
              if (result.data.status == "200") {
                this.$message({
                  type: "success",
                  message: "删除成功!",
                });
                location.reload();
              }
            });
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消删除",
          });
        });
    },
  },
};
</script>
<style lang="stylus" scoped>
.body-bgs {
  position: absolute;
  width: 100%;
  top: 0;
  left: 0;
  overflow-y: auto;
  background-color: #fff;
  margin-top: 100rem;
}

.my-ob {
  margin-top: 9rem;
}
.myobj {
  float: left;
  margin-left: 2rem;
  font-size: 1.8rem;
  margin-top: -1rem;
  padding-bottom: 5px;
  border-bottom: 2px solid #409EFF;
}
.memory {
  float: right;
  width: 10rem;
}
.search-conditions {
  margin-bottom:-2.5rem;
  text-align:left
  float: left;
  margin-top: 2rem;
  margin-left: 1%;
}
.create-obj {
  float: left;
  margin-left: 1%;
}
.create-obj el-button {
  float: left;
}
.refresh {
  width:15vw;
  height:3vh;
  float:right;
  margin-top:2rem;
  margin-right:-520%;
}
.ref {
  cursor:pointer;
  margin-left: 2rem;
}
.card {
  width: 98%;
  display: inline-block;
  margin: 0 auto;
  margin-top: 1rem;
}
.box-card {
  height: 10rem;
  margin-left:2rem;
}
.box-card:hover {
  background-color: #e2f7ff;
}

.obj-name {
  width:65%;
  font-size: 1.2rem;
}
.objn{
  width:100%
  font-weight: bold;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space:nowrap;
}
.tGroup{
  width:38%
  float: right;
  margin-top:-5rem;
}

.tag-group {
  width:20%
  float: right;
}

.operation-btn {
  float: right;
  margin-top:3rem;
}

.obj-message {
  width:100%;
  margin-top: 2%;
}

.obj-message span {
  font-size: 16px;
}

.three-point {
  width:5%;
  margin-top: 0.1rem;
  float: right;
  margin-left:75%;
}

.point {
  font-size: 1.5rem;
  font-weight: bold;
}

.point:hover {
  cursor: pointer;
}

.updata-time {
  float: right;
  margin-top: 2.5rem;
  margin-right: -35%;
}

.breadcrumb {
  margin-left: 5rem;
  margin-top: -3rem;
}

.step {
  width: 35%;
  float: right;
  margin-left: 15rem;
  margin-top: 1rem;
  background-color: #ffffff;
  font-size: 1rem;
}

.tit {
  font-size: 2rem;
  float: left;
  margin-top: 2rem;
  margin-left: 5rem;
}
.titup {
  font-size: 2rem;
  margin-left:2rem;
}
.form-sub{
  width:40%;
  margin-top: 8rem;
  margin-left:3rem;
}
.form-subup{
  width:45%;
  margin-top: 2rem;
  margin-left:2rem;
}
.form-sub el-form{
  float: left;
}
.form-subup el-form{
  float: left;
}

.step-two {
  width: 40%;
  float: right;
  margin-left: 1rem;
  margin-top: 1rem;
  background-color: #ffffff;
  font-size: 1rem;
}

.upload-file {
  margin-top: 6rem;
  margin-left: 5rem;
}

.selectType {
  margin-left: 5rem;
  margin-top: 7rem;
}
</style>